<template>
	<view>
		<!-- 未启动时显示页面按钮（操作前往操作页面） -->
		<view v-if="programState.status === '-1'" style="margin-top: 50%;">
			<view class="padding-xs flex align-center">
				<view class="flex-sub text-center">
					<view class="text-xsl padding" @tap="switchEditPage">
						<text class="cuIcon-settings text-green"></text>
					</view>
					<view class="padding" style="font-size: 14px">点击上方按钮前往操作页面</view>
				</view>
			</view>
		</view>
		<!-- 显示数据页面 -->
		<view v-else>
			<view v-if="programState.process.length > 0">
				<view class="cu-list grid col-3 no-border">
					<view class="cu-item" v-for="(item,index) in home_data.head" :key="index">
						<h3>{{ item.text }}</h3>
						<text>{{ item.type }}</text>
					</view>
				</view>
				
				<!-- opts:图表样式配置   chartData为：图标数据 -->
				<qiun-data-charts type="line" :opts="home_data.uchart_option.opts" :chartData="home_data.uchart_option.option"/>
				
			</view>
			<view v-else class="padding-xs flex align-center" style="margin-top: 50%;">
				<view class="flex-sub text-center">
					<view class="text-xsl padding" @tap="reloadRobotStatus">
						<text class="cuIcon-icloading text-green"></text>
					</view>
					<view style="font-size: 14px">数据正在构建中</view>
					<view style="font-size: 14px">可点击上方刷新</view>
					<view style="font-size: 14px">往监控查看日志</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import { homeDgs } from '@/api/era/era.js'
	
	export default {
		props: {
			basic: {},
			vprogramstate: {}
		},
		data() {
			return {
				chart: null,
				programState: {
					pan_opening: '1',	// 盘口类型  ('0', '实盘'), ('1', '模拟盘'),
					status: '-1',	// 程序状态 ('-1', '停止'), ('1', '运行中'), ('0', '平仓停止'),
					process: []	// 进程PID号
				},
				home_data: {
					head: [],	// 上部数据
					uchart_option: {}		// 交易对数据列表
				},
			}
		},
		watch: {
			vprogramstate: {
				immediate: true,
				handler (val) {
					this.programState = val
					if (this.programState.status !== '-1') {
						this.getHomeData()
					}
				}
			}
		},
		methods: {
			// 获取home数据
			getHomeData() {
				uni.showLoading({
					title: '加载中...',
				})
				var _this = this
				uni.getStorage({
					key:_this.basic.exchange_domain + _this.basic.strategy_name,
					success(resVisit) {
						homeDgs(resVisit.data.ip_address, `${_this.basic.exchange_domain}/${_this.basic.strategy_name}`, resVisit.data.access).then((res) => {
							console.log('获取home数据', res)
							_this.home_data.head = res.data.head
							_this.home_data.uchart_option = res.data.uchart_option
							setTimeout(function () {
								uni.hideLoading();
							}, 1000);
						})
						
					},fail(errVisit) {
						console.log('home数据获取token失败.')
						uni.showToast({ icon:'none', title: 'Token获取失败' })
						setTimeout(function () {
							uni.reLaunch({
								url: '/pages/home/home'
							});
						}, 1000)
					}
				})
				setTimeout(function () {
					uni.hideLoading();
				}, 2000);
			},
			switchEditPage() {
				this.$emit("selectPage", {pages:1})
			},
			reloadRobotStatus() {
				uni.showLoading({
					title: '加载中...',
				})
				var _this = this
				console.log('点击刷新并调用父组件获取机器人状态')
				_this.$emit("setRobotStatus")
				setTimeout(function () {
					uni.hideLoading();
				}, 1000);
			},
		}
	}
</script>

<style>

</style>
